<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>添加分类</title>
    <link rel="shortcut icon" href="favicon.ico">

    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" th:href="@{/resource/css/bootstrap.min.css}" />
    <link rel="stylesheet" th:href="@{/resource/css/font-awesome.min.css}" />
    <link rel="stylesheet" th:href="@{/resource/css/animate.css}" />
    <link rel="stylesheet" th:href="@{/resource/css/style.css}" />
    <link rel="stylesheet" th:href="@{/resource/css/plugins/toastr/toastr.min.css}" />
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>编辑分类-小分类</h5>
                </div>
                <div class="ibox-content">
                    <form class="form-horizontal m-t" id="commentForm" method="post">

                        <div class="form-group">
                            <label class="col-sm-3 control-label">名称：</label>
                            <div class="col-sm-8">
                                <input id="name" name="name"  type="text" class="form-control" required="" aria-required="true" th:value="${mode.name}">
                                <input id="cid" name="cid"  type="hidden" class="form-control" required="" aria-required="true" th:value="${mode.cid}">
                                <input id="id" name="id"  type="hidden" class="form-control" required="" aria-required="true" th:value="${mode.id}">
                                <input id="flag_tv" name="flag_tv"  type="hidden" class="form-control" required="" aria-required="true" th:value="${mode.flag}">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">排序：</label>
                            <div class="col-sm-8">
                                <input id="orderno" name="orderno" minlength="2" type="text" class="form-control" required="" aria-required="true" th:value="${mode.orderno}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">状态：</label>
                            <div class="col-sm-8">
                                <select class="form-control" name="flag" id="flag">
                                    <option value="0">正常</option>
                                    <option value="1">停用</option>
                                </select>
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-sm-4 col-sm-offset-3">
                                <button class="btn btn-primary" id="model_submit" type="button">提交</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

        </div>

        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <div class="row">
                        <div class="col-sm-10">  <h5>图标</h5></div>
                        <div class="col-sm-2">
                        </div>
                    </div>
                </div>
                <div class="ibox-content">

                    <div style="height: 150px;align-content: center">
                        <img  id="icon_img" style="max-width: 760px;max-height: 400px;" th:src="${'http://ou3sldl51.bkt.clouddn.com/'+mode.picurl}"/>
                    </div>
                    <a href="javascript:;" class="file">选择文件
                        <input type="file" name="fileToUpload" id="fileToUpload"  onchange="ajaxFileUpload()" multiple="multiple"/>
                    </a>


                    <input id="picurl" type="hidden" name="picurl" required="" aria-required="true" class="form-control" th:value="${mode.picurl}">

                    </p>
                </div>
            </div>
        </div>
    </div>

</div>



<script type="text/javascript" th:src="@{/script/js/jquery.min.js}"></script>
<script type="text/javascript" th:src="@{/script/js/bootstrap.min.js}"></script>
<script th:src="@{/script/js/plugins/bootstrap-table/bootstrap-table.min.js}"></script>
<script th:src="@{/script/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js}"></script>
<script th:src="@{/script/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
<script type="text/javascript" th:src="@{/script/js/contabs.js}"></script>
<script type="text/javascript" th:src="@{/script/js/plugins/toastr/toastr.min.js}"></script>
<script type="text/javascript" th:src="@{/script/js/common/common.js}"></script>
<script type="text/javascript" th:src="@{/script/js/plugins/validate/messages_zh.min.js}"></script>
<script type="text/javascript" th:src="@{/script/js/plugins/validate/jquery.validate.min.js}"></script>
<script type="text/javascript" th:src="@{/script/js/demo/form-validate-demo.js}"></script>
<script type="text/javascript" th:src="@{/script/js/ajaxfileupload.js}"></script>
<script>
    $(function () {
        $("#flag").val($("#flag_tv").val());
    });

    $("#model_submit").click(function () {
        var id = $("#id").val();
        var name = $("#name").val();
        var flag = $("#flag").val();
        var cid = $("#cid").val();
        var orderno = $("#orderno").val();
        var picurl = $("#picurl").val();
        var mydata = '{"id":'  + id + ',"name":"'  + name + '","flag":'+flag+',"cid":"'+cid+'","orderno":"'+orderno+'","picurl":"'+picurl+'"}';
        $.ajax({
            url: "/common/category/updateCategoryItem",
            type: "post",
            data: mydata,
            contentType: "application/json",
            dataType:"json",
            success: function (data) {
                if(data["retType"] == "0") {
                    toastr.success("修改成功!");
                    setTimeout("history.go(-1)",1000);//延时3秒

                } else {
                    toastr.error(data["retMsg"]);
                }
            }
        });
    });


    function ajaxFileUpload() {
        var imgurl = "http://ou3sldl51.bkt.clouddn.com/";
        $.ajaxFileUpload({
            url : '/common/upload/special', //用于文件上传的服务器端请求地址
            secureuri : false, //是否需要安全协议，一般设置为false
            fileElementId : 'fileToUpload', //文件上传域的ID
            type: "post",
            dataType : 'json', //返回值类型 一般设置为json
            success : function(data, status)//服务器成功响应处理函数
            {
                $("#icon_img").attr("src", imgurl+data.key);
                $("#picurl").val(data.key);
            },
            error : function(data, status, e)//服务器响应失败处理函数
            {
                toastr.success("文件上传失败!");
            }
        })
        return false;
    }
</script>

</body>

</html>